<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../../css/utils/bootstrap.min.css" />
    <link rel="stylesheet" href="../../css/utils/common.css" />
	<title></title>
	<style>
		* {
			margin: 0px;
			padding: 0px;
		}
		div {
			margin: 0px;
			padding: 0px;
		}
		.tab-sm-content {
			margin-top: 40px;
		}
		.row {
			margin-top: 50px;
		}
		.row .col-md-6 h4 {
		    padding: 15px 0 5px 0;
		}
		.uiwm-ce-tableltitle {
		    border: 1px solid #cdcdcd;
		    background-color: #eeeeee;
		    border-bottom: none;
		}
		.uiwm-ce-tableltitle {
			border: 1px solid #cdcdcd;
			background-color: #eeeeee;
			border-bottom: none;
		}
		.nav-tabs li {
			float: none;
			width: 100%;
		}
		.nav-tabs li a {
			border-color: #cdcdcd;
			border-radius: 0;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			padding: 0;
			margin-right: 0;
			border-bottom: 0 none;
		}
		.nav-tabs li.active a {
			background-color: #f5f5f5;
		}
		.team-col-md {
			width: 100%;
		}
		.col-md-container {
		    margin: auto;
			width: 800px;
		    color: #666666;
		}
	</style>
</head>
<body>
	<div class="content">
		<!--<div class="btn-group btn-group-justified btn-tab-sm" role="group" aria-label="button-group">
			<div class="btn-group" role="group">
				<button type="button" panel-data="tab-sm-panel1" class="btn btn-default active">团队统计</button>
			</div>
			<div class="btn-group" role="group">
				<button type="button" panel-data="tab-sm-panel2" class="btn btn-default">软文统计</button>
			</div>
		</div>-->
		<div class="tab-sm-content">
			<div id="tab-sm-panel1" class="tab-sm-pane active">
				<div class="col-md-0">
					<div class="col-md-container">
						<h4>团队统计</h4>
		                <table class="table table-hover" id="teamEffectTable">
		                    <thead>
		                      <tr>
		                          <th>排名</th>
		                          <th>部门</th>
		                          <th style="width:400px">成功指数</th>
		                      </tr>
		                    </thead>
		                    <tbody id="teamtbody"></tbody>
		                </table>
					</div>
			    </div>
				<div class="row">
					<div class="col-md-6">
						<h4>员工统计</h4>
						<div class="tab-content">
							<div role="tabpanel" class="tab-pane active">
								<table id="tb_show" class="table table-hover">
									<thead><th>序号</th><th>员工名字</th><th>成功指数</th><th>该员工客户统计</th></thead>
									<tbody id="teamtEmploystbody"></tbody>
								</table>
							</div>
						</div>
						<nav id="page1" class="text-center" aria-label="Page navigation">
							<ul class="pagination">
							</ul>
						</nav>
					</div>
					<div class="col-md-6">
						<h4>客户统计</h4>
						<div class="tab-content">
							<div role="tabpanel" class="tab-pane active">
								<table id="tb_show" class="table table-hover">
									<thead><th>序号</th><th>客户名字</th><th>成功指数</th><th>操作</th></thead>
									<tbody id="teamtClienttbody">
									</tbody>
								</table>
							</div>
						</div>
						<nav id="page2" class="text-center" aria-label="Page navigation">
							<ul class="pagination">
							</ul>
						</nav>
					</div>
				</div>
			</div>
			<div id="tab-sm-panel2" class="tab-sm-pane">
				<div class="row">
					<div class="col-md-6">
						<h4>团队统计</h4>
						<div class="tab-content">
							<div role="tabpanel" class="tab-pane active">
								<table id="tb_show" class="table table-hover">
									<thead><th>序号</th><th>员工名字</th><th>成功指数</th><th>该员工客户统计</th></thead>
									<tbody id="articletbody">
									</tbody>
								</table>
							</div>
						</div>
						<nav id="articlepage" class="text-center" aria-label="Page navigation">
							<ul class="pagination">
							</ul>
						</nav>
					</div>
					<div class="col-md-6">
						<h4>客户统计</h4>
						<div class="tab-content">
							<div role="tabpanel" class="tab-pane active">
								<table id="tb_show" class="table table-hover">
									<thead><th>序号</th><th>微信昵称</th><th>成功指数</th><th>所属人</th><th>所属部门</th><th>操作</th></thead>
									<tbody id="customerArticletbody">
									</tbody>
								</table>
							</div>
						</div>
						<nav id="customerArticlepage" class="text-center" aria-label="Page navigation">
							<ul class="pagination">
							</ul>
						</nav>
					</div>
				</div>
			</div>
		</div>
	</div>	
	<script type="text/javascript" src="../../js/utils/jquery-1.12.4.min.js" ></script>
	<script type="text/javascript" src="../../js/utils/bootstrap.min.js" ></script>
	<script type="text/javascript" src="../../js/utils/jquery.cookie.js" ></script>
	<script type="text/javascript" src="../../js/utils/page2.js?version=1" ></script>
	<script type="text/javascript" src="../../js/utils/boot.js" ></script>
	<script>
		var userID = $.cookie("userID");
		var companyID = $.cookie("companyID");
		var employsPageNo=1,clientPageNo=1,articlePageNo=1,customerArticlePageNo=1,tempEmploysID,tempArticleID;
		var panels = {pane1:0,pane2:0};
		$(function() {
			getTeamDataStatistics();
			getEmploysDataStatistics();
		})
		//数据统计（团队统计）
		function getTeamDataStatistics() {
			var data = {
				userID:userID,
				companyID:companyID
			}
			base.postData(base.url.teamDataStatistics, data, callbackTeamDataStatistics);
		}
		function callbackTeamDataStatistics(data) {
			if (data.success) {
				$("#teamtbody").html(getTeamListHtml(data.context.dataList));
			}
		}
		function getTeamListHtml(list) {
			var html = '';
			for (var index in list) {
				html += '<tr>'
				html += '	<td>'+(index*1+1)+'</td>'
				html += '	<td>'+list[index].departName+'</td>'
				html += '	<td>'+list[index].influence+'</td>'
				html += '</tr>'
			}
			return html;
		}
		//数据统计（员工影响力）
		function getEmploysDataStatistics() {
			var data = {
				userID:userID,
				companyID:companyID,
				pageNo: employsPageNo
			}
			base.postData(base.url.employsDataStatistics, data, callbackEmploysDataStatistics);
		}
		function callbackEmploysDataStatistics(data) {
			if (data.success) {
				if (panels.pane1 == 0) {
					//初始化分页
					var totalPage = Math.ceil(data.context.totalPage/10)||1;
					var page = {
						pageIndex:1,//初始页数
						currentPage:1,//当前页
						showPage:5,//显示页数
						totalPage:totalPage//总页数
					};
					$("#page1").initPage(page, callbackpage1);
				}
				if (data.context.totalPage > 0) {
					tempEmploysID = data.context.dataList[0].userID;
					getCustomerDataStatistics();
				}
				$("#teamtEmploystbody").html(getEmploysListHtml(data.context.dataList));
			}
		}
		function callbackpage1(page) {
			if (panels.pane1 == 0) {
				panels.pane1 = 1;
			}else{
				panels.pane2 = 0;
				clientPageNo = 1;
				employsPageNo = page.currentPage;
				getEmploysDataStatistics();	
			}
		}
		function getEmploysListHtml(list) {
			var html = '';
			for (var index in list) {
				html += '<tr>'
				html += '	<td>'+(index*1+1)+'</td>'
				html += '	<td>'+list[index].userName+'</td>'
				html += '	<td>'+list[index].influence+'</td>'
				html += '	<td><button class="btn btn-default detail" data-userID = "'+list[index].userID+'">详情</button></td>'
				html += '</tr>'
			}
			return html;
		}
		//数据统计（客户影响力）
		function getCustomerDataStatistics() {
			var data = {
				userID:tempEmploysID,
				companyID:companyID,
				pageNo: clientPageNo
			}
			base.postData(base.url.customerDataStatistics, data, callbackCustomerDataStatistics);
		}
		function callbackCustomerDataStatistics(data) {
			if (data.success) {
				if (panels.pane2 == 0) {
					//初始化分页
					var totalPage = Math.ceil(data.context.totalPage/10)||1;
					var page = {
						pageIndex:1,//初始页数
						currentPage:1,//当前页
						showPage:5,//显示页数
						totalPage:totalPage//总页数
					};
					$("#page2").initPage(page, callbackpage2);
				}
				$("#teamtClienttbody").html(getCustomerListHtml(data.context.dataList));
			}
		}
		function callbackpage2(page) {
			if (panels.pane2 == 0) {
				panels.pane2 = 1;
			}else{
				clientPageNo = page.currentPage;
				getCustomerDataStatistics();	
			}
		}
		function getCustomerListHtml(list) {
			var html = '';
			for (var index in list) {
				html += '<tr>'
				html += '	<td>'+(index*1+1)+'</td>'
				html += '	<td>'+list[index].userName+'</td>'
				html += '	<td>'+list[index].influence+'</td>'
				html += '	<td><button class="btn btn-default detail" data-customerID = "'+list[index].userID+'">详情</button></td>'
				html += '</tr>'
			}
			return html;
		}
		/*------------------软文统计分割线-------------------*/
		//数据统计（推文统计）
		function getArticleStatistics() {
			var data = {
				userID:userID,
				companyID:companyID,
				pageNo: articlePageNo
			}
			base.postData(base.url.articleStatistics, data, callbackArticleStatistics);
		}
		function callbackArticleStatistics(data) {
			if (data.success) {
				if (articlePageNo == 1) {
					var _totalPage = Math.ceil(data.context.totalPage/10)||1;
					//初始化分页
					var page = {
						pageIndex:1,//初始页
						currentPage:1,//当前页
						showPage:5,//显示页数
						totalPage:_totalPage,//总页数
						onPageClick: function(page) {
							articlePageNo = page.currentPage;
							getArticleStatistics();
							$("#articlepage").initPage(page);
			    			return false;  //默认的翻页事件
					    }
					};
				}
				$("#articlepage").initPage(page);
				if (data.context.totalPage > 0) {
					tempArticleID = data.context.dataList[0].articleID;
					getCustomerArticleStatistics();
				}
				$("#articletbody").html(getArticleListHtml(data.context.dataList));
			}
		}
		function getArticleListHtml(list) {
			var html = '';
			for (var index in list) {
				html += '<tr>'
				html += '	<td>'+(index*1+1)+'</td>'
				html += '	<td>'+list[index].userName+'</td>'
				html += '	<td>'+list[index].influence+'</td>'
				html += '	<td><button class="btn btn-default detail" data-articleID = "'+list[index].articleID+'">详情</button></td>'
				html += '</tr>'
			}
			return html;
		}
		//数据统计（客户推文统计）
		function getCustomerArticleStatistics() {
			var data = {
				articleID:tempArticleID,
				companyID:companyID,
				pageNo: customerArticlePageNo
			}
			base.postData(base.url.customerArticleStatistics, data, callbackCustomerArticleStatistics);
		}
		function callbackCustomerArticleStatistics(data) {
			if (data.success) {
				if (customerArticlePageNo == 1) {
					var _totalPage = Math.ceil(data.context.totalPage/10)||1;
					//初始化分页
					var page = {
						pageIndex:1,//初始页
						currentPage:1,//当前页
						showPage:5,//显示页数
						totalPage:_totalPage,//总页数
						onPageClick: function(page) {
							customerArticlePageNo = page.currentPage;
							getCustomerArticleStatistics();
							$("#customerArticlepage").initPage(page);
			    			return false;  //默认的翻页事件
					    }
					};
				}
				$("#customerArticlepage").initPage(page);
				$("#customerArticletbody").html(getCustomerArticleListHtml(data.context.dataList));
			}
		}
		function getCustomerArticleListHtml(list) {
			var html = '';
			for (var index in list) {
				html += '<tr>'
				html += '	<td>'+(index*1+1)+'</td>'
				html += '	<td>'+list[index].nickName+'</td>'
				html += '	<td>'+list[index].influence+'</td>'
				html += '	<td>'+list[index].userName+'</td>'
				html += '	<td>'+list[index].depart+'</td>'
				html += '	<td><button class="btn btn-default detail" data-customerID = "'+list[index].customerID+'">详情</button></td>'
				html += '</tr>'
			}
			return html;
		}
		$("#teamtEmploystbody").on("click", ".detail", function(){
			tempEmploysID = $(this).attr("data-userID");
			clientPageNo = 1;
			getCustomerDataStatistics();
		});
		$("#articletbody").on("click", ".detail", function(){
			tempArticleID = $(this).attr("data-articleID");
			customerArticlePageNo = 1;
			getCustomerArticleStatistics();
		});
		$("#teamtClienttbody").on("click", ".detail", function() {
			var _customerID = $(this).attr("data-customerID");
			window.location.href = "../myClient/clientDetails.html?customerID="+_customerID;
		})
		$("#customerArticletbody").on("click", ".detail", function() {
			var _customerID = $(this).attr("data-customerID");
			window.location.href = "../myClient/clientDetails.html?customerID="+_customerID;
		})
		$(".btn-tab-sm").on("click", "button", function(){
			$(".btn-tab-sm button").removeClass("active");
			$(this).addClass("active");
			var panelId = $(this).attr("panel-data");
			if (panelId == "tab-sm-panel1") {
				getTeamDataStatistics();
				getEmploysDataStatistics();
			} else {
				getArticleStatistics();
			}
			$(".tab-sm-content .tab-sm-pane").removeClass("active");
			$("#"+panelId).addClass("active");
		});
	</script>
</body>
</html>
